<template>
    <div class="container">
        <svg
            ref="svg"
            version="1.1"
            id="svg"
            width="100vw"
            height="100vh"
            xmlns="http://www.w3.org/2000/svg"
        >
            <g id="light">
                <g>
                    <radialGradient
                        id="SVGID_1_"
                        cx="580.5708"
                        cy="330.8928"
                        r="257.2822"
                        fx="470.0911"
                        fy="563.2468"
                        gradientUnits="userSpaceOnUse"
                    >
                        <stop offset="0.1569" style="stop-color:#F1C593" />
                        <stop offset="1" style="stop-color:#CB332B" />
                    </radialGradient>
                    <path
                        fill="url(#SVGID_1_)"
                        d="M427.94,167.181l-74.628,290.46l261.747,118.223c0,0,159.03-198.845,187.478-271.878
			c0,0,44.794-113.208-126.219-187.298C676.318,116.689,466.937,20.976,427.94,167.181z"
                    />

                    <radialGradient
                        id="SVGID_2_"
                        cx="484.1505"
                        cy="516.197"
                        r="192.6884"
                        fx="485.5024"
                        fy="420.1404"
                        gradientTransform="matrix(0.9291 0.3698 -0.1937 0.4867 134.3187 85.9354)"
                        gradientUnits="userSpaceOnUse"
                    >
                        <stop offset="0.2763" style="stop-color:#F9DC8D" />
                        <stop offset="0.6608" style="stop-color:#EFAE3B" />
                    </radialGradient>
                    <path
                        fill="url(#SVGID_2_)"
                        d="M615.059,575.864c-12.044,23.706-82.826,18.543-154.879-14.484
			c-80.556-36.925-118.913-80.032-106.869-103.738s91.923-21.983,162.587,13.92S627.103,552.158,615.059,575.864z"
                    />
                    <radialGradient
                        id="SVGID_3_"
                        cx="512.8211"
                        cy="272.6941"
                        r="134.7785"
                        gradientUnits="userSpaceOnUse"
                    >
                        <stop offset="0.1569" style="stop-color:#C9643B" />
                        <stop offset="1" style="stop-color:#B83838" />
                    </radialGradient>
                    <path
                        fill="url(#SVGID_3_)"
                        d="M595.131,100.777c0,0-89.853,40.039-164.62,343.383l2.851,0.452
			C433.362,444.611,489.83,178.351,595.131,100.777z"
                    />
                    <radialGradient
                        id="SVGID_4_"
                        cx="668.8254"
                        cy="346.6765"
                        r="134.697"
                        gradientUnits="userSpaceOnUse"
                    >
                        <stop offset="0.1569" style="stop-color:#C9643B" />
                        <stop offset="1" style="stop-color:#B83838" />
                    </radialGradient>
                    <path
                        fill="url(#SVGID_4_)"
                        d="M752.367,176.144c0,0,27.593,97.104-167.575,341.066l-0.85-1.114
			C583.943,516.095,754.914,306.909,752.367,176.144z"
                    />
                    <linearGradient
                        id="SVGID_5_"
                        gradientUnits="userSpaceOnUse"
                        x1="316.899"
                        y1="697.691"
                        x2="458.9744"
                        y2="697.691"
                    >
                        <stop offset="0" style="stop-color:#F09E73" />
                        <stop offset="1" style="stop-color:#CB332B" />
                    </linearGradient>
                    <path
                        fill="url(#SVGID_5_)"
                        d="M392.722,598.283c-1.782,3.297,53.605,27.477,66.252,29.247
			c-6.17,7.393-19.513,17.471-40.479,80.235c-10.284,30.786-19.134,57.4-45.476,89.334c-8.373-4.824-31.684-34.858-56.12-44.018
			c0,0,25.845-37.413,37.357-64.395C368.88,654.41,376.882,618.075,392.722,598.283z"
                    />
                    <radialGradient
                        id="SVGID_6_"
                        cx="453.5772"
                        cy="543.9395"
                        r="64.5634"
                        gradientUnits="userSpaceOnUse"
                    >
                        <stop offset="0.1569" style="stop-color:#C9643B" />
                        <stop offset="1" style="stop-color:#B83838" />
                    </radialGradient>

                    <path
                        fill="none"
                        stroke="url(#SVGID_6_)"
                        stroke-width="2"
                        stroke-linecap="round"
                        stroke-linejoin="round"
                        stroke-miterlimit="10"
                        d="
			M496.085,464.665c0,0-77.483,140.499-85.015,158.549"
                    />
                </g>
            </g>
            <use class="lights" href="#light" x="0" y="50" />
            <use class="lights" href="#light" x="300" y="400" />
            <use class="lights" href="#light" x="500" y="300" />
            <use class="lights" href="#light" x="900" y="100" />
            <use class="lights" href="#light" x="1200" y="0" />
            <use class="lights" href="#light" x="800" y="450" />
            <use class="lights" href="#light" x="1200" y="500" />

            <g id="tree" fill="#333" stroke="none">
                <path
                    d="M6347 12523 c-28 -256 -99 -838 -103 -842 -9 -9 -23 16 -60 109 -102
262 -274 549 -386 645 l-22 20 18 -30 c10 -16 28 -43 40 -60 116 -160 245
-515 291 -799 21 -132 17 -140 -44 -83 -42 39 -117 87 -137 87 -3 0 21 -18 54
-40 73 -49 135 -136 151 -210 21 -99 12 -451 -22 -813 -18 -190 -36 -338 -42
-340 -5 -1 -25 27 -44 63 -161 314 -323 592 -508 874 -104 159 -105 160 -168
355 -35 108 -69 224 -75 259 -17 82 -8 161 24 220 l26 47 -25 -28 c-64 -71
-68 -195 -15 -396 35 -132 33 -121 18 -121 -7 0 -26 19 -42 43 -65 93 -339
457 -343 454 -2 -2 31 -64 73 -138 229 -403 484 -901 464 -907 -7 -3 -31 10
-53 27 -129 97 -326 195 -532 266 -200 69 -305 133 -421 258 -77 83 -140 191
-184 319 -33 96 -39 85 -11 -17 42 -150 123 -290 227 -392 35 -34 61 -68 59
-75 -5 -13 45 -38 296 -143 267 -112 431 -210 585 -349 116 -105 195 -212 240
-322 43 -107 43 -107 -34 -118 -48 -6 -130 -48 -197 -100 -88 -67 -195 -161
-195 -170 0 -5 -8 -19 -17 -30 -10 -12 7 2 37 31 70 65 198 156 274 195 79 40
165 49 193 21 41 -41 203 -522 253 -748 70 -323 52 -632 -61 -1025 -43 -151
-54 -180 -68 -180 -5 0 -24 44 -42 98 -43 123 -147 330 -224 447 -33 49 -99
130 -147 181 -132 138 -227 179 -319 140 -34 -15 -34 -15 22 -9 44 4 63 1 96
-15 55 -28 134 -111 198 -208 61 -90 171 -311 181 -363 8 -40 23 -42 -151 22
-141 52 -251 100 -435 191 -152 75 -143 63 31 -39 65 -38 120 -74 121 -80 2
-6 -47 -13 -122 -17 -85 -4 -147 -13 -193 -28 -38 -12 -67 -23 -65 -25 2 -2
32 3 68 12 95 22 326 13 440 -17 64 -17 338 -135 357 -153 11 -12 55 -210 64
-293 15 -136 2 -211 -56 -319 -51 -95 -61 -125 -85 -253 -10 -53 -32 -149 -49
-212 -41 -155 -71 -345 -71 -455 0 -152 -20 -150 -121 10 -126 202 -311 388
-840 846 -556 483 -716 645 -886 899 -81 121 -116 197 -109 239 25 155 255
399 406 432 87 19 177 -3 255 -62 35 -27 34 -25 -9 16 -36 34 -64 50 -107 62
-33 9 -59 22 -59 28 0 16 188 94 259 107 31 6 108 8 171 6 106 -4 111 -3 65 8
-27 7 -81 13 -120 13 -99 2 -106 9 -58 62 86 93 153 228 194 386 29 116 22
120 -16 7 -55 -166 -122 -281 -211 -364 -68 -64 -105 -84 -225 -126 -57 -20
-144 -56 -194 -82 -49 -25 -142 -71 -206 -103 -81 -41 -131 -74 -168 -110 -40
-40 -55 -49 -64 -40 -20 20 -15 451 6 591 36 235 102 489 184 705 40 108 108
248 249 511 26 49 40 82 31 74 -44 -42 -290 -401 -349 -510 -90 -165 -187
-387 -244 -557 -25 -76 -49 -142 -54 -147 -5 -5 -25 24 -46 65 -72 145 -155
245 -263 319 -164 112 -239 251 -260 486 l-8 99 -2 -98 c-1 -118 20 -229 60
-313 16 -34 29 -66 29 -71 0 -5 37 -40 81 -79 149 -126 161 -138 204 -198 59
-85 97 -164 135 -283 l33 -103 -17 -105 c-36 -232 -39 -407 -10 -577 9 -49 3
-49 -124 7 -133 59 -274 107 -628 215 -343 105 -408 129 -472 171 -152 103
-203 217 -154 347 19 49 154 255 198 303 17 18 21 28 13 36 -7 7 -4 30 11 79
15 46 23 104 26 174 l4 105 -15 -98 c-24 -168 -71 -279 -179 -420 -35 -46 -69
-93 -75 -105 -18 -34 -34 -26 -65 33 -52 101 -168 182 -312 219 -90 23 -100
19 -19 -8 156 -51 245 -118 297 -224 32 -65 33 -69 33 -203 0 -133 1 -137 28
-173 35 -45 83 -81 217 -159 144 -84 286 -146 625 -272 327 -122 487 -188 593
-248 l73 -41 58 -121 c144 -295 369 -576 804 -1002 114 -112 207 -207 207
-213 0 -15 -9 -14 -257 31 -363 65 -427 82 -514 138 -110 70 -262 196 -371
308 -86 88 -97 103 -102 143 -19 158 -29 209 -53 281 -14 44 -42 107 -62 140
-46 75 -157 200 -196 220 -16 8 -60 32 -97 53 -75 42 -520 238 -526 232 -2 -3
37 -25 87 -51 85 -44 110 -65 77 -65 -7 0 -73 5 -146 11 -146 12 -374 1 -555
-27 -133 -21 -152 -34 -40 -27 116 7 383 -12 522 -37 229 -41 410 -113 528
-208 56 -46 66 -60 127 -188 57 -120 67 -149 73 -215 7 -74 2 -119 -14 -119
-4 0 -43 19 -87 43 -201 108 -419 193 -634 247 -65 16 -139 30 -163 30 -24 0
-70 5 -102 11 -43 8 -64 8 -79 -1 -12 -6 -44 -14 -71 -19 -39 -6 -12 -8 115
-13 l165 -5 152 -51 c195 -65 377 -149 542 -248 180 -108 177 -105 201 -198
23 -93 55 -165 104 -239 38 -57 44 -77 24 -77 -7 0 -69 7 -138 15 -124 15
-630 33 -620 22 3 -3 71 -11 150 -17 153 -11 404 -46 605 -83 114 -22 125 -26
206 -80 188 -125 373 -193 879 -322 504 -129 693 -198 856 -313 87 -62 184
-179 214 -259 42 -113 101 -439 86 -478 -7 -20 -45 -19 -98 3 -126 54 -315 82
-613 92 -296 9 -394 24 -590 90 -159 53 -521 209 -648 279 l-102 56 -97 195
c-53 107 -97 192 -97 188 -1 -4 17 -56 39 -115 63 -167 57 -168 -100 -23 -178
165 -330 302 -355 320 -20 14 0 -8 198 -218 53 -56 97 -107 97 -113 0 -6 -44
-8 -122 -4 l-123 5 106 -19 c182 -34 198 -43 329 -188 208 -229 266 -282 385
-352 163 -95 158 -92 147 -103 -14 -14 -529 -4 -662 12 -440 53 -767 210
-1168 564 -161 142 -174 158 -205 257 -47 150 -60 254 -54 452 2 98 3 176 1
174 -2 -2 -11 -48 -19 -103 -18 -118 -19 -303 -4 -409 6 -42 8 -79 4 -83 -18
-18 -164 167 -360 453 -87 127 -164 237 -172 245 -12 13 -13 12 -5 -10 20 -53
271 -549 312 -615 199 -326 490 -666 728 -850 50 -38 91 -76 91 -82 1 -17 -25
-16 -200 2 -374 39 -907 134 -1303 231 -98 25 -181 42 -183 40 -5 -5 150 -55
377 -121 79 -23 146 -47 147 -52 2 -6 -43 -16 -104 -23 -239 -28 -387 -98
-453 -214 -17 -28 -30 -55 -29 -61 0 -5 8 6 19 26 28 54 113 125 178 149 116
44 187 54 382 53 208 0 323 -13 650 -74 118 -22 232 -43 253 -47 22 -4 40 -11
40 -17 1 -5 -38 -17 -88 -27 -187 -38 -330 -92 -458 -174 -74 -47 -172 -136
-210 -189 -12 -17 6 -5 44 31 123 116 259 188 442 234 153 38 261 50 469 50
262 0 356 -13 528 -70 338 -113 630 -150 1365 -170 271 -7 373 -14 570 -39
387 -50 596 -93 618 -128 4 -5 0 -47 -8 -94 -28 -177 -38 -394 -32 -732 7
-418 44 -861 115 -1392 14 -104 16 -161 10 -285 -14 -290 -39 -734 -63 -1127
l-25 -393 -49 -80 c-93 -149 -224 -309 -319 -389 l-47 -39 -205 -21 c-450 -45
-677 -72 -735 -87 -233 -60 -417 -188 -554 -384 -43 -62 -60 -100 -102 -233
-28 -87 -49 -161 -46 -163 3 -3 39 35 82 83 42 48 93 98 113 110 106 65 348
94 917 108 342 9 439 29 655 130 176 83 223 84 165 4 -14 -19 -42 -63 -62 -99
-30 -53 -37 -77 -41 -137 -3 -46 0 -84 8 -103 12 -29 72 -90 89 -90 5 0 1 20
-8 45 -15 43 -15 47 4 82 27 49 109 90 267 133 208 56 320 118 425 235 32 36
64 65 71 65 8 0 27 -9 42 -20 142 -101 457 -172 694 -157 83 6 98 3 224 -34
237 -69 752 -168 958 -184 l79 -6 -35 31 c-19 18 -87 73 -150 124 -99 80 -173
135 -415 303 l-40 28 35 3 c43 4 448 -64 672 -112 290 -63 622 -162 740 -222
27 -14 60 -29 74 -34 22 -9 23 -8 15 9 -26 48 -276 257 -422 353 -419 273
-947 467 -1499 548 -80 12 -150 27 -157 33 -32 32 -129 646 -164 1037 -18 198
-16 631 4 835 48 491 50 1366 7 2263 -13 252 -19 233 118 364 103 98 165 131
337 182 113 33 133 36 335 45 l215 9 625 -89 c344 -49 632 -88 640 -86 15 3
-187 61 -485 141 -87 23 -160 47 -162 53 -3 7 16 14 49 17 29 3 121 13 203 22
202 21 351 47 529 91 l149 37 91 -23 c159 -40 273 -92 472 -213 104 -63 200
-121 214 -128 47 -25 3 16 -144 133 -209 167 -272 207 -405 252 -36 12 -67 27
-69 33 -2 6 21 23 50 38 29 15 187 105 350 200 251 146 315 178 405 208 141
45 234 63 368 73 l110 7 -60 9 c-33 4 -111 6 -172 2 -74 -4 -113 -2 -113 4 0
6 137 92 305 192 168 100 304 184 301 186 -2 2 -102 -37 -222 -87 -120 -50
-224 -89 -231 -88 -9 2 19 46 78 123 50 66 142 197 204 290 175 265 176 279 8
72 -168 -207 -287 -344 -386 -445 -102 -104 -117 -116 -207 -167 -62 -35 -530
-235 -550 -235 -6 0 -10 33 -10 83 0 45 -5 99 -10 119 -14 49 -67 126 -110
157 -34 25 -34 25 8 -22 87 -97 110 -228 61 -348 -19 -47 -274 -144 -472 -179
-241 -42 -510 -54 -717 -31 -138 15 -298 8 -660 -29 -233 -24 -339 -26 -366
-6 -19 14 -19 15 1 40 31 38 1026 699 1228 814 98 56 182 102 186 102 4 0 50
20 102 44 116 54 312 126 441 161 l98 26 128 -31 c71 -17 220 -62 332 -100
112 -38 205 -68 207 -66 5 5 -253 125 -374 173 -63 25 -112 51 -110 57 8 23
316 74 612 102 146 14 181 20 150 26 -22 4 -65 7 -95 8 -30 0 -62 4 -69 9 -17
11 -22 8 133 71 129 52 222 108 294 176 l57 56 -50 -37 c-73 -54 -236 -130
-340 -159 -136 -38 -532 -106 -685 -116 -352 -26 -560 -65 -751 -143 -169 -68
-236 -85 -277 -68 -79 33 -68 128 47 414 93 233 274 543 437 751 51 64 81 89
211 176 162 108 244 146 390 181 76 18 109 20 243 16 85 -3 166 -8 180 -11 14
-3 -1 3 -33 14 -72 24 -237 42 -317 33 -86 -9 -78 11 31 76 49 29 88 55 86 58
-3 2 -109 -48 -237 -112 -221 -109 -270 -128 -270 -105 0 17 328 337 475 465
76 66 154 135 174 153 l36 33 -40 -22 c-199 -110 -616 -418 -857 -633 -92 -82
-118 -98 -118 -76 0 5 25 78 55 161 31 83 54 153 52 155 -2 3 -38 -73 -80
-168 -42 -95 -85 -193 -96 -218 -11 -25 -58 -87 -106 -139 -179 -196 -306
-375 -401 -563 -30 -60 -58 -108 -64 -108 -5 0 -14 8 -20 18 -8 13 -9 9 -4
-18 11 -50 10 -55 -20 -155 -15 -49 -34 -139 -42 -200 -28 -212 -34 -247 -59
-298 -77 -162 -276 -313 -588 -447 -114 -48 -147 -58 -147 -42 0 4 25 38 55
75 72 89 128 187 155 267 19 54 21 79 17 152 -4 55 -1 110 8 152 17 81 78 201
145 284 28 34 47 62 41 62 -17 0 -138 -141 -172 -201 -19 -33 -43 -72 -54 -87
-11 -14 -21 -38 -21 -52 -5 -108 -25 -252 -39 -285 -29 -67 -86 -146 -170
-234 -76 -79 -234 -214 -313 -266 -35 -23 -373 -148 -547 -202 -44 -14 -120
-43 -169 -64 -111 -50 -134 -49 -163 11 -70 144 -75 445 -12 705 40 164 159
316 315 399 190 103 729 425 889 531 449 300 808 633 1014 939 106 156 194
338 241 494 11 37 36 92 57 122 20 30 29 49 20 41 -10 -8 -21 -11 -24 -7 -4 4
3 66 15 139 29 169 27 213 -3 77 -102 -468 -254 -749 -585 -1081 -180 -180
-500 -437 -531 -427 -6 2 20 42 58 88 383 466 568 924 513 1268 -7 43 -7 68 0
82 9 16 8 20 -5 20 -9 0 -27 27 -45 66 -16 36 -50 95 -75 130 -58 80 -75 129
-75 211 0 90 22 169 84 298 115 239 319 497 686 865 102 102 174 176 160 164
-229 -189 -526 -478 -674 -654 -113 -135 -224 -302 -276 -413 -52 -114 -65
-108 -56 25 12 187 68 398 171 644 67 158 64 156 -20 -11 -75 -151 -150 -357
-180 -495 -22 -103 -31 -310 -16 -396 17 -94 61 -205 121 -299 67 -105 94
-194 94 -310 1 -130 -72 -405 -149 -560 -62 -125 -163 -285 -180 -285 -8 0
-15 27 -19 69 -16 182 -107 354 -281 537 l-66 69 85 -114 c152 -203 208 -339
207 -501 0 -109 -18 -185 -57 -241 -79 -115 -374 -394 -585 -554 -234 -178
-639 -418 -664 -393 -2 2 23 89 56 193 163 512 207 789 195 1205 -8 250 -1
325 41 430 38 94 96 186 200 318 162 206 258 335 307 414 59 96 166 212 219
239 29 15 49 19 75 14 55 -10 127 -51 179 -100 25 -25 48 -43 50 -42 9 9 -54
113 -95 155 -61 64 -117 92 -190 95 -69 2 -68 -2 -29 168 42 180 57 346 56
599 0 124 -4 248 -8 275 -7 49 -7 48 -15 -40 -22 -262 -62 -510 -82 -510 -7 0
-34 34 -62 75 -80 120 -96 124 -37 8 29 -57 58 -131 65 -163 11 -54 10 -66
-10 -130 -37 -117 -87 -234 -142 -334 -42 -75 -81 -125 -193 -244 -77 -83
-178 -192 -223 -243 -46 -52 -87 -92 -91 -89 -4 2 -11 123 -14 269 -4 146 -12
338 -18 428 -11 156 -10 171 15 348 32 221 68 401 96 490 12 36 50 110 85 165
60 95 68 103 140 144 82 47 96 60 38 36 -57 -24 -60 -5 -11 71 58 91 60 94 55
94 -3 0 -33 -39 -68 -87 -35 -49 -98 -122 -140 -163 -64 -63 -83 -91 -123
-175 -27 -55 -53 -111 -60 -125 -6 -14 -16 -25 -21 -25 -6 0 -12 196 -16 513
-4 282 -9 515 -11 518 -3 2 -8 -22 -11 -53z m73 -11209 c0 -8 -5 -12 -10 -9
-6 4 -8 11 -5 16 9 14 15 11 15 -7z"
                />
                <path d="M5406 12055 c-3 -8 -1 -15 4 -15 13 0 22 18 11 24 -5 3 -11 -1 -15
-9z" />
            </g>
        </svg>
    </div>
</template>

<style lang="scss" scoped>
.container {
    background: linear-gradient(to bottom, #4c58a4, #976986, #e27a67);
    height: 100vh;
    .btn-right {
        position: fixed;
        right: 0;
        top: 50%;
        opacity: 0;
        border: none;
        background: rgba(0, 0, 0, 0.3);
        color: white;
        height: 50px;
        width: 50px;
        border-radius: 50%;
        text-align: center;
        margin: 0;
        padding: 0;
        &:hover {
            opacity: 1;
        }
    }
    .btn-left {
        position: fixed;
        left: 0;
        top: 50%;
        opacity: 0;
        border: none;
        background: rgba(0, 0, 0, 0.3);
        color: white;
        height: 50px;
        width: 50px;
        border-radius: 50%;
        text-align: center;
        margin: 0;
        padding: 0;
        &:hover {
            opacity: 1;
        }
    }
}
#tree {
    transform: translate(700px, 1300px) scale(0.09) rotate(180deg);
}
#light {
    transform: scale(0.2);
    animation: play 2s ease-in-out infinite alternate;
}
.lights {
    &:nth-of-type(1) {
        transform: rotate(-24deg) scale(1.5) translate(150px, 100px);
        animation: play1 3s ease-in-out infinite alternate;
    }
    &:nth-of-type(2) {
        opacity: 0.6;
        transform: rotate(-40deg) scale(1.2) translate(-500px, 50px);
        animation: play2 1s ease-in-out infinite alternate;
    }
    &:nth-of-type(3) {
        transform: rotate(-20deg) scale(2) translate(-300px, -100px);
    }
    &:nth-of-type(4) {
        transform: scale(1.3) translate(-150px, -50px);
        animation: play4 0.5s ease-in-out infinite alternate;
    }
    &:nth-of-type(5) {
        opacity: 0.7;
        transform: scale(0.9) translate(300px, -250px) rotate(15deg);
    }
    &:nth-of-type(6) {
        opacity: 0.8;
        transform: scale(1.1) translate(-100px, 750px) rotate(-45deg);
        animation: play6 1s ease-in-out infinite alternate;
        animation-delay: 0.3s;
    }
}
@keyframes play {
    0% {
        transform: scale(0.2) translate(-100px, -50px);
    }
    50% {
        transform: scale(0.2) translate(0, 0px);
    }
    100% {
        transform: scale(0.2) translate(100px, -50px);
    }
}
@keyframes play1 {
    0% {
        transform: rotate(-24deg) scale(1.5) translate(100px, 50px);
    }
    50% {
        transform: rotate(-24deg) scale(1.5) translate(150px, 100px);
    }
    100% {
        transform: rotate(-24deg) scale(1.5) translate(200px, 50px);
    }
}
@keyframes play2 {
    0% {
        opacity: 0.6;
        transform: rotate(-40deg) scale(1.2) translate(-475px, 0px);
    }
    100% {
        opacity: 0.6;
        transform: rotate(-40deg) scale(1.2) translate(-500px, 0px);
    }
}
@keyframes play4 {
    0% {
        transform: scale(1.3) translate(-155px, -50px);
    }
    100% {
        transform: scale(1.3) translate(-150px, -50px);
    }
}
@keyframes play6 {
    0% {
        opacity: 0.8;
        transform: scale(1.1) translate(-100px, 775px) rotate(-45deg);
    }
    100% {
        opacity: 0.8;
        transform: scale(1.1) translate(-100px, 750px) rotate(-45deg);
    }
}
</style>